<template>
	<div>
		<el-select
			ref="sgoods"
		    style="width: 400px;"
		    @change="changeSelect"
		    size="mini"
		    v-model="goods_name"
		    filterable
		    remote
		    reserve-keyword
		    placeholder="请输入商品名称"
		    :remote-method="remoteMethod"
		    :loading="loading">
		    <el-option
		      v-for="item in options"
		      :key="item.goods_id"
		      :label="item.goods_type_name"
		      :value="item.goods_type_name">
		    </el-option>
		  </el-select>
	</div>
</template>

<script>
	export default {
		data(){
			return {
				 loading: false,
				 options:[],
				 goods_name:"",
			}
		},
		props:{
			scopeData:{
				type:Object,
				default:{}
			},
			order_number:{
				type:String,
				default:''
			}
		},
		watch:{
			
		},
		mounted() {
			this.goods_name = this.scopeData.row.show_goods_name
		},
		methods:{
			focusinput(){
				this.$refs.sgoods.focus()
			},
			changeSelect(val){
				let obj = {
					rowIndex:this.scopeData.$index,
					goods_name:this.goods_name,
				}
				this.$emit('getGoodsData',obj)
			},
			remoteMethod(keywords) {
				if (keywords !== '') {
					this.loading = true
				  this.$post('/homeSet/searchGold',{keywords},res=>{
					  this.loading = false
					  let result = res.data.data
					  if(result.length==1){
						  this.goods_name = result[0].goods_type_name
						  let obj = {
							rowIndex:this.scopeData.$index,
						  	goods_name:this.goods_name,
						  }
						  this.$refs.sgoods.blur()
						  this.$emit('getGoodsData',obj)
					  }
					  this.options = res.data.data
				  })
				} else {
				  this.options = [];
				}
		  }
		}
	}
</script>

